<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>注册</title>
		<link rel="stylesheet" href="css/style.css">
		<style type="text/css">
			body {
				background-image: url(img/bg.jpg);
				width: 100%;
				height: 100%;
				min-width: 1000px;
				z-index: -10;
				zoom: 1;
				background-repeat: no-repeat;
				background-size: cover;
				-webkit-background-size: cover;
				background-position: center 0;
			}

			html body {
				height: 100%;
				width: 100%;
			}

			section {
				width: 100%;
			}

			form {
				text-align: center;
				margin: 10px auto 0;
				width: 230px;
				height: 200px;

			}

			.form_input {
				width: 184px;
				height: 29px;
				line-height: 29px;
				margin-bottom: 16px;
				border: 0;
				text-indent: 10px;
			}

			.form_button {
				display: inline-block;
				background-color: #f40;
			}

			.form_button:hover {
				background-color: rgb(255, 103, 0);
			}

			form a {
				text-decoration: none;
				color: #6c6c6c;
				float: right;
				margin-right: 29px;
			}
		</style>
		<script type="text/javascript">

		</script>
	</head>
	<body>
		<header class="header_status">
			<p class="login_header"><a href="index.html">欢迎注册</a></p>
		</header>
		<body>
			<section>
				<form action="#">
					账户注册<br /><br />
					<input class="form_input" id="username" type="text" placeholder="手机号/邮箱" autofocus><br />
					<input class="form_input" id="password" type="password" placeholder="密码"><br />
					<input class="form_input" id="repassword" type="password" placeholder="确认密码"><br />
					<button class="form_input form_button" id="registe" type="submit">注&nbsp;&nbsp;册</button><br />
				</form>
			</section>
			<script type="text/javascript" src="js/jquery.js"></script>
			<!-- <script type="text/javascript" src="js/loginreg.js"></script> -->
			<script type="text/javascript">
				function initdb() {
					var db = openDatabase('mydb', '1.0', 'userinfo', 2 * 1024 * 1024);
					db.transaction(function (tx) {
						tx.executeSql('CREATE TABLE IF NOT EXISTS USERINFO (username, password);');
					});
				}

				function adduser(username, password) {
					var db = openDatabase('mydb', '1.0', 'userinfo', 2 * 1024 * 1024);
					db.transaction(function(tx) {
						tx.executeSql('SELECT * FROM USERINFO WHERE username = ?;', [username], function(tx, results) {
							var len = results.rows.length;
							if (len > 0)
								alert("该用户名已存在");
							else {
								db.transaction(function(tx) {
									var sqlstr = "INSERT INTO USERINFO (username, password) VALUES ('" + username + "', '" + password +
										"');";
									tx.executeSql(sqlstr);
									alert("注册成功");
									sessionStorage.username = username;
								});
							}
						}, null);
					});
				}

				$(document).ready(function() {
					initdb();
				});

				// 注册
				$("#registe").on('click', function () {
					var username = $("#username").val();
					var password = $("#password").val();
					var repassword = $("#repassword").val();
					if (username != "" & password != "" & password == repassword)
						adduser(username, password);
					else
						alert("用户名或密码有误！");
				});		
			</script>

		</body>
</html>
